<template>
  <view class="entire">
    <view class="top">
      <view class="left">
        <wd-icon name="list" size="30rpx" />
        &ensp;{{ msg.title }}
      </view>
    </view>
    <divider />
    <view class="bottom">
      <view class="left">
        <wd-icon name="time" size="28rpx" />
        &ensp;{{ msg.time }} ~ {{ msg.endtime }}
      </view>
      <view class="right" @click="navToRichText(msg)">查看详情</view>
    </view>
  </view>
</template>

<script setup lang="ts">
import { NoticeItem } from '@/service/leftTop/leftTop'
const props = defineProps<{
  msg: NoticeItem
}>()

const navToRichText = (data) => {
  uni.navigateTo({
    url: '/pages-sub/notice/noticeRichText?data=' + encodeURIComponent(JSON.stringify(data)),
  })
}
</script>

<style scoped lang="scss">
.entire {
  width: 700rpx;
  height: 150rpx;
  background-color: white;
  border-radius: 15rpx;
  margin-left: 25rpx;
  margin-top: 30rpx;
  display: flex;
  flex-direction: column;
  .top {
    width: 700rpx;
    height: 80rpx;
    display: flex;
    justify-content: space-between;
    .left {
      margin-left: 20rpx;
      margin-top: 20rpx;
      width: 600rpx;
      height: 60rpx;
      font-size: 25rpx;
      font-weight: bold;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
    }
  }
  .bottom {
    width: 700rpx;
    height: 70rpx;
    display: flex;
    .left {
      margin-left: 16rpx;
      width: 400rpx;
      height: 50rpx;
      display: flex;
      font-size: 23rpx;
      color: #254872;
    }
    .right {
      margin-left: 100rpx;
      width: 120rpx;
      height: 40rpx;
      border-radius: 18rpx;
      background-color: #254872;
      display: flex;
      justify-content: center;
      align-items: center;
      font-size: 22rpx;
      color: #ffffff;
      cursor: pointer;
    }
  }
}
</style>
